.date-input {

  input {
    cursor: pointer;
  }

  :global(.vdp-datepicker__calendar) {
    background-color: var(--background);
    border-color: var(--input-border);

    :global(.cell:not(.blank):not(.disabled).day:hover),
    :global(.cell:not(.blank):not(.disabled).month:hover),
    :global(.cell:not(.blank):not(.disabled).year:hover) {
      border: 1px solid var(--teal);
    }

    :global(.cell.selected) {
      background: var(--teal);
      color: var(--action-button-text);
    }

    :global(header .prev:not(.disabled):hover),
    :global(header .next:not(.disabled):hover),
    :global(header .up:not(.disabled):hover) {
      background: var(--button-hover);
    }

    :global(.cell.disabled) {
      opacity: 0.25;
    }

    :global(.cell.today) {
      font-weight: bolder;
    }
  }
}
